<template>
	<view>
		<!-- 检测点信息头部 -->
		<view class="hosp-header">
			<image class="logo" :src="hospInfo.logo" mode="heightFix"></image>
			<view>
				<view class="hosp-info"><uni-icons type="info"></uni-icons><text> {{hospInfo.name}}</text></view>
				<view class="hosp-info"><uni-icons type="phone"></uni-icons><text> {{hospInfo.phone}}</text></view>
			</view>
		</view>
		<!-- 检测点简介信息 -->
		<scroll-view scroll-y="true" class="hosp-introduction">
			<sunui-grand :content="introduction" color="#1D82FE" bg="#fff" :clamp='6' expandText="点击展开全文" shinkText="收起"></sunui-grand>
		</scroll-view>
		
		<view class="map-img" @click="gotoMap" >
			<image src="../../static/map.png" mode="widthFix"></image>
			<text class="map-text">院区地址:{{hospInfo.detailAddr}}</text>
		</view>
		
		<view>
			<view class="hj-type" @click="clickType(0)">
				<view>
					<view class="hj-text">
						核酸检测（标本单采）
					</view>
					<view class="hj-text">
						{{time}}
					</view>
				</view>
				<view class="hosp-price">
					<view>40.00</view>
					<uni-icons type="arrowright" size="25"></uni-icons>
				</view>
			</view>
			<view class="hj-type" @click="clickType(1)">
				<view>
					<view class="hj-text"> 
						核酸检测（标本混采）
					</view>
					<view class="hj-text">
						{{time}}
					</view>
				</view>
				<view class="hosp-price">
					<view>10.00</view>
					<uni-icons type="arrowright" size="25"></uni-icons>
				</view>
			</view>
		</view>
	</view>
</template>

<script>

	import sunUiGrand from '../../components/sunui-grand/sunui-grand.vue'
	import { mapState, mapMutations } from 'vuex'
	export default {
		data() {
			return {
				id:null,
				hospInfo:null,
				introduction:'',
				time:null,
				plugin:requirePlugin('routePlan'),
				key:'7Z6BZ-XVQWW-VCURA-RZCPH-YP3X7-2QFFJ',
				referer:'核算预约之毕业设计',
				endPoint:null,
				name:'',
				latitude:0,
				longitude:0,
				seconds:3	,//倒计时秒数
				timer:null	//定时器
			};
		},
		components: {
					'sunui-grand': sunUiGrand
		},
				
		onLoad(options) {
			this.formatTime()
			this.id = options.id
			console.log(this.id)
			this.getHospInfoById()
			this.getIntroductionById()
		},
		
		computed: {
			...mapState('m_user',['token']),
		},
		
		
		
		methods:{
			...mapMutations('m_user',['updateRedirectInfo']),
			//获取检测点信息
			getHospInfoById(){
				uni.request({
					url:'http://192.168.43.224:9001/admin/hospinfo/getHospInfoById/'+this.id,
					method:'GET',
					success: (res) => {
						console.log(res)
						this.hospInfo = res.data.data
						this.name = res.data.data.name
						this.latitude = res.data.data.latitude
						this.longitude = res.data.data.longitude
					}
				})
			},
			
			//获取检测点检测点简介
			getIntroductionById(){
				uni.request({
					url:'http://192.168.43.224:9001/admin/hospinfo/getIntroductionById/'+this.id,
					method:'GET',
					success: (res) =>{
						this.introduction = res.data.data
					}
				})
			},
			
			//格式化当前时间
			formatTime(){
				var date = new Date()
				var year = date.getFullYear()
				console.log(year)
				var month = date.getMonth() + 1
				var day = date.getDate()
				var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours()
				var minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()
				var second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds()
				month >= 1 && month <= 9 ? (month = "0" + month) : ""
				day >= 0 && day <= 9 ? (day = "0" + day) : ""
				var timer = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second
				this.time = timer
			},
			
			//赋值endpoint
			saveEndPoint(){
				console.log('hospInfo:'+this.hospInfo)
				// this.endPoint = JSON.stringify({
				// 	'name':this.name,
				// 	'latitude':this.latitude,
				// 	'longitude':this.longitude
				// })
				// console.log('endPoint:'+this.endPoint)
			},
			
			//地图显示
			gotoMap(){
				let endPoint = JSON.stringify({  //终点
				  		'name': this.name,
				  		'latitude': this.latitude,
				  		'longitude': this.longitude
					});
				console.log('endPoint:'+endPoint)
				uni.navigateTo({
					url:'plugin://routePlan/index?key=' + this.key + '&referer=' + this.referer + '&endPoint=' + endPoint + '&navigation=1'
				})
			},
			
			//选择核检类型
			clickType(type){
				if(!this.token){
					return this.delayNavigate()
				}
				uni.navigateTo({
					url:'/subpkg/order_date/order_date?'+
					'type='+type+
					'&time='+this.time +
					'&hospId='+this.hospInfo.id
				})
			},
			
			//演示导航到登录页面
			delayNavigate(){
				this.showTips(this.seconds)
				
				//定时
				this.timer = setInterval(()=>{
					this.seconds--
					if(this.seconds <= 0){
						//清除定时器
						clearInterval(this.timer)
						//跳转
						uni.switchTab({
							url:'/pages/my/my',
						})
						return this.seconds = 3
					}
					this.showTips(this.seconds)
				},1000)
			},
			
			//展示倒计时的提示消息
			showTips(n){
				uni.showToast({
					title:'您还未登录,'+n+'秒后自动跳转到登录页',
					icon:'none',
					mask:true,	//防止用户点击穿透
					duration:1500
				})
			}
			
		}
	}
</script>

<style lang="scss">
.hosp-header{
	height: 80px;
	background-color: #fffffff;
	display:flex;
	margin-left:10px;
	.logo{
		height: 100%;
	}
	.hosp-info{
		margin-left: 10px;
		margin-top: 10px;
		.text{
			margin-left: 10px;
		}
	}
}

.hosp-introduction{
	height: 180px;
	font-size: 13;
	margin-top: 10px;
}
.map-img{
	height: 60px;
	width: 100%;
	position: relative;
	display: flex;
	justify-content: space-around;
	margin-top: 10px;
	.image{
		width: 100%;
	}
	.map-text{
		position: absolute;
		top: 15px;
		left: 100px;
		font-size: 15;
		color: #6A6A6A;
		
	}
}
.hj-type{
	margin-top: 15px;
	// border: 1rpx solid #000000;
	width: 100%;
	height: 80px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: #EBEEF5;
	box-shadow: 5rpx #C0C4CC;
	.hj-text{
		margin-top: 10px;
		margin-left: 10px;
		line-height: 30px;
	}
	.hosp-price{
		display: flex;
		color: #F3A73F;
	}
}
</style>
